<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <link href='css/sales.css' rel='stylesheet' type='text/css'>
    <script type="text/javascript" src="echarts.min.js"></script>
    <script type="text/javascript" src="vue.js"></script>
    <script src="jquery.js"></script>
    <script src="js/sales.js"></script>
</head>
<body>
<div id="main">
      <div class="main-up">
          <div id="upleft" class="up-left">
              <div id="ttp" class="top5">
                  <ul>
                      <li v-for="list in lists">
                          <div>{{list.name}}</div>
                          <p>{{list.sub}}</p>
                      </li>
                  </ul>
              </div>
              <div id="ttp2" class="top5">
                  <ul>
                      <li v-for="list in lists">
                          <div>{{list.name}}</div>
                          <p>{{list.sub}}</p>
                      </li>
                  </ul>
              </div>
          </div>
          <div class="up-right" id="upright">
              <div id="logo" class="logo">
                  <div>2018-5-18 <span>14:33:38</span></div>
              </div>
              <div class="up-sales">
                  <div>订单状态详情</div>
                  <div><span>当月</span><span>当日</span></div>
              </div>
              <section id="mainsales">
                  <ul id="tob1" class="tob">
                      <li>
                          <div></div>
                          <div>已付款</div>
                          <div>已发货</div>
                          <div>已完成</div>
                      </li>
                      <li v-for="list in lists">
                          <div>{{list.company}} </div>
                          <div v-for="payment in list.payments"><p>{{payment.van}}万 </p><p>{{payment.single}}单 </p></div>
                          <div v-for="delivery in list.deliverys"><p>{{delivery.van}}万</p><p>{{delivery.single}}单</p></div>
                          <div v-for="complete in list.completes"><p>{{complete.van}}万</p><p>{{complete.single}}单</p></div>
                      </li>
                  </ul>
                  <ul id="tob2" class="tob">
                      <li>
                          <div></div>
                          <div>已付款</div>
                          <div>已发货</div>
                          <div>已完成</div>
                      </li>
                      <li v-for="list in lists">
                          <div>{{list.company}} </div>
                          <div v-for="payment in list.payments"><p>{{payment.van}}万 </p><p>{{payment.single}}单 </p></div>
                          <div v-for="delivery in list.deliverys"><p>{{delivery.van}}万</p><p>{{delivery.single}}单</p></div>
                          <div v-for="complete in list.completes"><p>{{complete.van}}万</p><p>{{complete.single}}单</p></div>
                      </li>
                  </ul>
              </section>
          </div>
          <div class="down">
              <div class="button-tit">
                  订单金额详情 <span><i></i>当月</span><span><i></i>当日</span>
              </div>
              <ul>
                  <li id="tip1" style="width: 437px;height: 428px"></li>
                  <li id="tip2"></li>
                  <li id="tip3"></li>
                  <li id="tip4"></li>
              </ul>
          </div>
      </div>
  </div>
<script>
    $(function () {
        var myDate = new Date();
        var x=myDate.toLocaleString( );
        $(".up-right .logo> div").html(x);
    })
</script>
</body>
</html>
